<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    *{
        margin: 0;
        padding: 0;
    }
body,html{
    height: 100%;
}
    #container {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #timeBox {
        width: 300px;
        height: 100px;
        background-color: orange;
        color: blueviolet;
        border-radius: 10px;
        
    }

    #time {
        margin-left: 28px;
        line-height: 100px;
        font-size: 25px;
    }
</style>

<body>
    <div id="container">
        <div id="timeBox">
            <div id="time"></div>
        </div>
    </div>
    <script>
        // 使用js做一个电子表, 显示当前时间，格式为: yyyy-mm-dd hh:mm:ss, 并能够随时间跳动，可以参考js时间对象。
        function electronicWatch() {
            let time = new Date();
            let year = time.getFullYear();
            let month = time.getMonth();
            let day = time.getDate();
            let hours = time.getHours();
            let minutes = time.getMinutes();
            let second = time.getSeconds();
                if (month < 10) {
					month = "0" + (month+1);
				}
				if (day < 10) {
					day = "0" + day;
				}
				if (hours < 10) {
					hours = "0" + hours;
				}
				if (minutes < 10) {
					minutes = "0" + minutes;
				}
				if (second < 10) {
					second = "0" + second;
				}
            let timeNow = document.getElementById('time').innerHTML = year + "-" + month  + "-" + day + '  ' + hours + ":" + minutes + ":" + second;

        }
        //输出
        // console.log(year+":"+(month+1)+":"+day+' '+hour+":"+minutes+":"+second);
        setInterval("electronicWatch();", 1000);
    </script>
</body>

</html>